<template>
  <div style="min-width: 1100px;">
    <article-header></article-header>
    <div class="article-layout">
      <!-- 文章内容 -->
      <div>
        <article-show></article-show>
      </div>
      <!-- 广告 -->
      <div>
        <!-- <target></target> -->
        <advertis></advertis>
      </div>
    </div>
    <article-footer></article-footer>
    <back-up></back-up>
  </div>
</template>

<script>
  import ArticleFooter from '@/views/common/footer.vue'
  import ArticleHeader from '@/views/common/header.vue'
  import BackUp from '@/views/common/backup.vue'
  import Advertis from '../common/advertis.vue'
  import Target from '../common/target.vue'
  import ArticleShow from '../personalCenter/components/ArticleShow.vue'
  export default{
    data(){
      return{
      }
    },
    methods:{
    },
    components:{
      ArticleFooter,
      ArticleHeader,
      BackUp,
      Advertis,
      Target,
      ArticleShow
    },
  }
</script>

<style scoped="scoped">
  .article-layout {
    width: 80%;
    margin: 0 auto;
    display: flex;
    justify-content: space-around;
  }

  .article-layout div:nth-child(1){
    flex: 3;
    margin: 5px 10px;
  }
  .article-layout div:nth-child(2){
    flex: 1;
    margin: 5px 10px;
  }
</style>
